// vue3封装resize函数

const map = new WeakMap()

const ob = new ResizeObserver((entries) => {
  for (const entry of entries) {
    const handler = map.get(entry.target)
    handler &&
      handler({
        width: entry.borderBoxSize[0].inlineSize,
        height: entry.borderBoxSize[0].blockSize,
      })
  }
})

ob.observe(document.body)

export default {
  mounted(el, bindings) {
    ob.observe(el) // 监听元素尺寸变化
    map.set(el, bindings.value) // 存储绑定的值
  },
  unmounted(el) {
    ob.unobserve(el) // 取消监听
  },
}
